import React, { useState } from 'react'
import { Tabs } from '@kube-design/components'

const { TabPanel } = Tabs

const Header = ({ changeTab }) => {
  const [tab, setTab] = useState('1')
  return (
    <div className="header">
      <div className="left">
        <h1>个人中心</h1>
        <p className="hi">欢迎使用PaaS云平台！</p>
        <p className="des">资源占用超载,请合理使用资源。</p>
      </div>
      <div className="right">
        <Tabs
          type="button"
          activeName={tab}
          onChange={newTab => {
            setTab(newTab)
            changeTab(newTab)
          }}
        >
          <TabPanel label="联调环境模式" name={'1'}></TabPanel>
          <TabPanel label="生产环境模式" name={'2'}></TabPanel>
        </Tabs>
      </div>
    </div>
  )
}

export default Header
